<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>LoopBack 4 Core Modules WebPack Demo</title>
  </head>
  <body>
    <div id="greetings"></div>

    <script src="dist/bundle-web.js"></script>
    <script>
      (async () => {
        // Exported TypeScript functions/classes/types/constants are now
        // available under `LoopBack` namespace
        const greetings = await LoopBack.main();

        const greetingsEl = document.getElementById('greetings');
        greetingsEl.insertAdjacentHTML('beforeend', '<h1>Hello from LoopBack</h1>')
        greetingsEl.insertAdjacentHTML('beforeend', '<p/>')
        const listEl = document.createElement('ul')
        greetings.forEach((g) => {
          listEl.insertAdjacentHTML('beforeend', `<li>${g}</li>`);
        })
        greetingsEl.insertAdjacentElement('beforeend', listEl);

        return greetings;
      })()
        .catch(err => alert(err));
    </script>
  </body>
</html>
